<template>
    <div style="margin:10px;">
        <div class="table-operator">
            <a-button  shape="round" size="small" type="primary" icon="plus" @click="addPane">添加页签</a-button>
        </div>
        
        <ExtForm ref="ExtForm" :formfields="formfields" @changeEventHandler="changeEventHandler"></ExtForm>
        
        
    </div>
</template>
<script>

import defaultSettings from '@/config/defaultSettings'
import pageSetting from '@/components/lt/codeGenerator/pageSetting'
import Vue from 'vue'
import ExtForm from '@/components/lt/codeGenerator/components/ExtForm'
import draggable from 'vuedraggable'
import {SysMixin} from '@/mixins/SysMixin'

export default {
    name:'TabAttribute',
    components:{draggable,ExtForm},
    mixins:[SysMixin],
    props:{
        component:{
           type:Object,
           default:()=>{}
        },
    },
    watch:{
        
    },
    data(){
        return{
            defaultSettings,
            pageSetting,
            formfields:[
                {field:'label',label:'标题',component:pageSetting.常量.表单组件类型.单行文本,initialValue:this.component.label,rules: [{ required: true, message: '不能为空!' }]},
                {field:'defaultActiveKey',label:'默认面板key',component:'input',initialValue:this.component.props["defaultActiveKey"]},
                {field:'size',label:'大小',component:pageSetting.常量.表单组件类型.下拉选择,initialValue:this.component.props["size"],options:pageSetting.数据字典.组件大小类型},
                {field:'type',label:'类型',component:pageSetting.常量.表单组件类型.下拉选择,initialValue:this.component.props["type"],options:pageSetting.数据字典.TAB类型},
                {field:'change',label:'change事件',component:pageSetting.常量.表单组件类型.单行文本,initialValue:this.component.props["change"]},
            ]
               
        }
    },
   
    created(){
        
    },
    methods:{
        changeEventHandler(item){
         
            if(item["label"]){
                this.component.label=item.label
                for(let i=0;i<this.component.components.length;i++){
                    if(this.component.components[i].type==pageSetting.常量.组件.标题){
                        this.component.components[i].label=item.label
                    }
                }
            }else{
                for (const key in item) {
                    Vue.set(this.component.props,key,item[key])
                }
            }

        },
        addPane(){
            let d = new Date().getTime()
            let pane = {ref:d,label:'页签',tab:'页签',component:'a-tab-pane',echoComponent:'EchTabPane',class:'iconfont icon-tab1',
                components:[{component:'EchLabel',echoComponent:'EchLabel',label:'页签',parent:"a-tab-pane",type:'EchLabel'}],
                id:d,props:{componentRef:d,tab:'页签'},
                dragIn:["a-tabs"]

            }
            this.component.components.push(pane)
          
        },
        
    }
}
</script>